/* 顶部DIV */
.topDiv{
    height: 45px;
    background: #333333;
}
.topDiv-con{
    width: 1226px;
    height: 963px;
    margin: 0 auto;
    display: flex
}
.topDiv-con .pointer {
    cursor: pointer;
    color: #b0b0b0;
    font-size: 12px;
    text-decoration: none;
}
.top_leftDiv{
    width:940px;
    height:45px; 
}

.top_leftDiv ul{
    width: 940px;
    height:45px;
    text-align: center;
    line-height: 45px;
    
}

.top_leftDiv li{
    background: url(../images/shuxian.png) no-repeat 0 center; 
    float: left;
    color: #b0b0b0;
    font-size: 12px;
    padding-right: 10px; 
    padding-left: 7px;
}
.top_leftDiv li:hover{
    color: white;
}
.top_rightDiv{
    display: flex;
}
.top_rightDiv ul{
    height:45px;
    text-align: center;
    line-height: 45px;
    display: flex;
}
.top_rightDiv li{
    padding-right: 10px;
    padding-left: 8px;
    background: url(../images/shuxian.png) no-repeat 0 center; 
}
.top_rightDiv li:hover{
    color: white;
}
.top_rightDiv_lable{
    width: 112px;
    height:45px;
    display: flex;
    margin-left: 32px;
    text-align: center;
    line-height: 45px;
    background: #424242;
}
.top_rightDiv_lable i{
   
    padding-left: 12px;
    box-sizing: border-box;
}
.top_rightDiv_lable:hover{
    color: white;
}
/* 业务导航区域*/
.itemNavDiv{
    width: 1226px;
    height: 790px;
    margin: 0 auto;
  
   
}
.itemNavDiv-top{
    width: 1226px;
    height: 70px;
    display: flex;
    align-content: center;
    justify-content: space-between;
}
.itemNavDiv-top img{
    width: 60px;
    height: 60px;
    margin-top: 25px
}
.item-center{
    display: flex;
    margin-top: 50px;
}
.item-center li{
    padding-right: 18px;
    color: #333333;
}
.itemNavDiv-top .item-right{
width: 320px;
height: 56px;
display: flex;
border: 1px solid #b0b0b0;
margin-top: 25px
}
.itemNavDiv  select{
    width: 270px;
    height: 54px; 
}
.itemNavDiv a{
    text-decoration: none;
}

#item-icon{
    font-size: 18px;
    width: 50px;
    font-weight: bold;
    text-align: center;
    line-height: 55px; 
    border-left: 1px solid #b0b0b0;
}
.item-content{
    width: 1226px;
    height: 460px;
    display: flex;
    justify-content: space-between;
    margin-top: 40px;
}
.item-contentLeft{
    width: 220px;
    height: 460px;
    background: #6f818e;
}
.item-contentLeft>ul{
    width: 220px;
    height: 460px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.item-contentLeft>ul>li>a{
    text-decoration: none;
    color: #f5f5f5;
    box-sizing: border-box;
}
.item-contentLeft>ul>li>a>span{
   
    padding-left: 28px;
}
.item-contentLeft>ul>li>a>i{
    float: right;
    padding-right: 20px;
}
.item-contentRight{
    position: relative;
    width: 1006px;
    height: 460px;
}
.item-contentRight img{
    width: 1006px;
    height: 460px;
}
.item-contentRight>ul{
    position: absolute;
    left: 0;
    top: 0px;
}

.item-contentRight ul>li {
    display: none;
  }

.item-contentRight  ul>li.current {
    display: block;
  }

.item-contentRight>a {
    width:40px;
    height: 55px;
    display: block;
    color: #687a87;
    text-align: center;
    line-height: 50px;
    position: absolute;
    font-size: 44px;
    top: 50%;
    transform: translateY(-50%);
    margin-right: 7px;
    margin-left: 7px;
  }
.item-contentRight>a:hover{
      background: #495e6b;
      opacity: 0.5;
      color: #f5f5f5
  }  
.item-contentRight a.left {
    left: 0;
  }

.item-contentRight a.right {
    right: 0;
  }

.item-contentRight ol {
    width: 100px;
    height: 20px;
    position: absolute;
    right: 20px;
    bottom: 10px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
  }

.item-contentRight  ol>li {
    width:10px;
    height:10px;
    border: 1px solid  #687a87;
    background-color: #687a87;
    border-radius: 50%;
    cursor: pointer;
    box-sizing: border-box;
  }

.item-contentRight ol>li.active {
    background-color: #f5f5f5;
  }

.item-bottom{
    width: 1226px;
    display: flex;
    height: 170px;
    margin-top: 20px;
}
.item-bottom>ol{
    width: 220px;
    height: 170px; 
    background: #5f5750;
    box-sizing: border-box;
}
.item-bottom>ol>li>a>div{
    width: 70px;
    height: 85px;
    border: 1px solid #665e57;
    float: left;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    color: #f5f5f5;
    justify-content: center;
    padding-left: 12px;
}
.item-bottom>ol>li>a>div>i{
    padding-left: 15px;
    font-size: 18px;
    box-sizing: border-box;
}
.item-bottom>ol>li>a>div>span{
    font-size: 12px;
    padding-top: 5px;
    box-sizing: border-box;
}
.item-bottom>ul{
    width: 996px;
    height: 170px;
    display: flex;
    justify-content: space-between;
    margin-left: 20px;
}
.item-bottom>ul>li>a>img{
    width: 316px;
    height: 170px;
}
/* list数据渲染区域 */
.mainDiv{
    width: 1226px;
    height: 920px;
    background:#f5f5f5;
    margin: 0 auto;
    
}
.mainDivTop-img>img{
    width: 1226px;
    margin-top: 30px;
}
/* 手机 */
.mainDiv-Phone{
    width: 1226px;
    height: 710px;
}
.mainDiv-PhoneTop{
    height: 90px;
    display: flex;
    justify-content: space-between;
    padding-top: 50px;
    box-sizing: border-box;
}
.mainDiv-PhoneTop>span{
    font-size: 18px;
}
.mainDiv-PhoneTop>a{
    text-decoration: none;
    color: #757575;
   
}
.mainDiv-PhoneTop>a>i{
   color: #757575;
   font-size: 22px;
   width: 100px;
}
.mainDiv-PhoneTop>a:hover{
    color: orangered
}
.mainDiv-PhoneTop>a>i:hover{
    color: orangered
}
.mainDiv-PhoneBottom{
    height: 614px;
    display: flex;
    justify-content: space-between;
}
.mainDiv-PhoneBottomLeft>a>img{
  width: 220px;
  height: 579px;
}
.mainDivPhoneBottomRight{
    width: 996px;
    height: 614px;
    margin-left: 20px;
}
.mainDivPhoneBottomRight>ul{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}
.mainDivPhoneBottomRight>ul>li{
    width: 220px;
    height: 280px;
    background: white;
    margin-bottom: 18.3px;
    text-decoration: none;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 100%;
    flex-direction: column;
}
.mainDivPhoneBottomRight>ul>li>h4{
    font-size: 14px;
    color: #333333;
}
.mainDivPhoneBottomRight>ul>li>img{
    width: 160px;
    height: 160px;
}
.mainDivPhoneBottomRight>ul>li>p{
    font-size: 12px;
    color: #999999;
}
.mainDivPhoneBottomRight>ul>li>span{
    font-size: 14px;
    color: orangered;
    padding-top: 6px;
}
.mainDivPhoneBottomRight>ul>li>h6{
    width: 60px;
    height: 18px;
    font-size: 12px;
    color: #fafafa;
    text-align: center;
    line-height: 18px;
    background: lightblue;
    margin-top: 3px;
    text-decoration: none;
}
.mainDivPhoneBottomRight>ul>li>h6>a{
    text-decoration: none;
}
/* 服务区域 */
.serveDiv{
    width: 1226px;
    height: 413px;
    margin: 0 auto;
}
.serveDiv-top{
    width: 1226px;
    height: 90px;
    display: flex;
    border-bottom: 1px solid #b0b0b0;
}
.serveDiv-top>div{
    width: 245px;
    height: 30px;
    border-right: 1px solid #b0b0b0;
    box-sizing: border-box;
    margin-top: 35px;
}
.serveDiv-top>div>ul>li>a{
    display: block;
    width: 150px;
    text-decoration: none;
    color: #5f5750;
    margin: 5px 0px 0px 60px;
}
.serveDiv-bottom{
    display: flex;
    margin-top: 40px;
}
.serveDiv-bottom h3,h6,i{
    font-weight: normal;
    font-style: normal;
}
.serveDivBottom-left{
    display: flex;
    width: 979px;
    justify-content: space-between;
}
.serveDivBottom-left span{
    display: block;
    font-size: 14px;
    height: 30px;
    margin-bottom: 20px;
}
.serveDivBottom-left a{
    text-decoration: none;
    color: #5f5750;
    font-size: 12px;
    height: 20px;
    margin-bottom: 7px;
    display: block;
}
.serveDivBottom-right{
    width: 227px;
    height: 100px;
    border-left: 1px solid #b0b0b0;
}
.serveDivBottom-right>div{
    width: 150px;
    margin-left: 63px;
}
.serveDivBottom-right h3{
    color: orangered;
    font-size: 20px;
}
.serveDivBottom-right p{
    font-size: 12px;
    color:#757575;
}
.serveDivBottom-right h6{
    text-align: center;
    line-height: 30px;
    margin-left: 7px;
    color: orangered;
    font-size: 12px;
    width: 120px;
    height: 30px;
}
.serveDivBottom-right h6:hover{
    background: orangered;
    color: whitesmoke
}
.serveDivBottom-right span{
    font-size: 12px;
    color:#757575;
    margin-left: 7px;
}
/* 底部区域 */
.bottomDiv{
    width: 1226px;
    height:230px;
    margin: 0 auto;
    display: flex;
    padding-top: 40px;
    background: #fafafa;
}
.bottomDiv>img{
    width: 60px;
    height: 60px;
    
}
.bottomDiv-right{
    margin-left: 14px;
    font-size: 13px;
   
}
.bottomDiv ul>a{
    text-decoration: none;
    color: #757575;
   
}
.bottomDiv ul>a>li{
    float: left;
    padding:0px 5px 0px 5px;

    background: url(../images/xian.png) no-repeat center right
}

.bottomDiv ol>li>a{
    text-decoration: none;
    color: #b0b0b0;
}
.bottomDiv ol>li{
    color: #b0b0b0;
}
.bottomDiv-ol{
margin-top: 35px;
}
.bottomDiv-ol>ol{
    display: flex;
}
.bottomDiv-bottom>img{
    width: 100px;
    height: 30px;
    margin-top: 6px;
}
.bottomDiv-ol>p{
    width: 1226px;
    height:60px;
    margin-top: 30px;
    font-size: 18px;
    line-height: 60px;
    color: #b0b0b0;
    text-align: center;
  
}
/* 右边导航栏 */
.right-nav{
    width:70px;
    height:360px;
    position:fixed;
    right:0px;
    bottom:110px;
    border: 1px solid #b0b0b0;
}
.right-nav>ul{
    display: flex;
    flex-direction: column;
}
.right-nav>ul>li{
    width:70px;
    height:90px;
    border-bottom: 1px solid #b0b0b0;
}
.right-nav>ul>li>a{
    display: flex;
    flex-direction: column;
    text-decoration: none;
}
.right-nav>ul>li>a>i{
    font-size: 26px;
    color: #999999;
    padding:25px 0 0 25px;
    box-sizing: border-box
}
.right-nav>ul>li>a>span{
    font-size: 14px;
    color: #999999;
    padding:8px 0 0 7px;
}

/* 回到顶部 */
.back-top{
    width:70px;
    height: 90px;
    border: 1px solid #b0b0b0;
    position: fixed;
    right: 0px;
    bottom: 50px;
    display: none;
}
.back-top>li>a{
    display: flex;
    flex-direction: column;
    text-decoration: none;
}
.back-top>li>a>i{
    font-size: 26px;
    color: #999999;
    padding:25px 0 0 25px;
    box-sizing: border-box

}
.back-top>li>a>span{
    font-size: 14px;
    color: #999999;
    padding:8px 0 0 15px;
}
